<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>WeChat</title>
		<link rel="stylesheet" type="text/css" href="css/wechat.css"/>
		<script src="js/chat.js" type="text/javascript"></script>
	</head>
	<body>
		<div class="screen">
			<!-- 状态栏 -->
			<div class="status_bar">
				<div class="signal">
					<img src="img/信号.svg" alt="">
					<img src="img/信号.svg" alt="">
					<p>15k/s</p>
				</div>
				<div class="time">
					<p>18:53</p>
				</div>
				<div class="other">
					<img src="img/WiFi.svg" alt="">
					<img src="img/铃声-静音.svg" alt="">
					<p>49%</p>
					<img src="img/电池电量.svg" alt="">
				</div>
			</div>
			<!-- 微信头部 -->
			<div class="header">
				<p>微信</p>
				<div class="weright">
					<img src="img/查找.svg" alt="">
					<img src="img/添加.svg" alt="">
				</div>
				
			</div>
			<!-- 主体	 -->
			<div class="main">
				<ul class="message">
					<li>
						<div class="photo">
							<img src="img/head_erhuo.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>必看</p>
								<p>23:23</p>
							</div>
							
							<p style="color: red;">
								[12条]必看：习主席那儿能点，里面能在自动回复（点发送，最后点表请，语音可以放）
							</p>
							
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/A2.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>a boy</p>
								<p>22:23</p>
							</div>
							<p>[2条]a boy：混蛋！我女神是不是跟你告白了</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/F1.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>Forever</p>
								<p>22:12</p>
							</div>
							<p>[2条]Forever：那个啥,我发现我有那么一点喜欢你</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/马云.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>马云</p>
								<p>21:59</p>
							</div>
							<p>[2条]马云：小子来阿里吧，1000万年薪+10%阿里股份</p>
						</div>
					</li>
					<a href="html/chat.html" target="_self" class="c5">
						<li>
							<div class="photo">
								<img src="img/习主席.jpg" alt="">
							</div>
							<div class="name">
								<div class="speak">
									<p>习主席</p>
									<p>21:24</p>
								</div>
								<p>[1条]习主席：小同志,祖国的未来就靠你了,好好干</p>
							</div>
						</li>
					</a>
					<li>
						<div class="photo">
							<img src="img/A1.jpeg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>阿贰</p>
								<p>21:12</p>
							</div>
							<p>[3条]阿贰：出来浪，赶紧的</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/Trump.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>Trump</p>
								<p>20:47</p>
							</div>
							<p>[12条]Trump：Come to America.You're President.</p>
						</div>
					</li>
					
					<li>
						<div class="photo">
							<img src="img/A4.jpeg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>a girl</p>
								<p>20:25</p>
							</div>
							<p>[1条]a girl：我喜欢你</p>
						</div>
					</li>
					
					<li>
						<div class="photo">
							<img src="img/A3.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>俺要打屎你</p>
								<p>19:53</p>
							</div>
							<p>[2条]俺要打屎你：开游戏，赶紧的</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/李彦宏.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>李彦宏</p>
								<p>19:50</p>
							</div>
							<p>[2条]李彦宏：工资你随便开，来百度就行</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/E2.jpeg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>厄难</p>
								<p>19:47</p>
							</div>
							<p>[1条]厄难：出来一下，有好事</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/马化腾.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>马化腾</p>
								<p>19:43</p>
							</div>
							<p>[1条]马化腾：明天中午吃顿饭吧，谈谈你的薪资</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/F2.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>风一样的男子</p>
								<p>19:23</p>
							</div>
							<p>[1条]风一样的男子：小伙子可以呀</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/F3.jpeg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>非法拘禁</p>
								<p>18:59</p>
							</div>
							<p>[12条]非法拘禁：干的漂亮</p>
						</div>
					</li>
					<li>
						<div class="photo">
							<img src="img/艾艾.jpg" alt="">
						</div>
						<div class="name">
							<div class="speak">
								<p>艾艾</p>
								<p>18:23</p>
							</div>
							<p>[2条]艾艾：啦啦啦</p>
						</div>
					</li>
				</ul>
			</div>
			
			
			<!-- footer区 -->
			<div class="footer">
				<div class="wechat">
					<a href="wechat.html" class="a1" target="_self">
						<div class="imgs one">
						</div>
						微信
					</a>
				</div>
				
				<div class="wechat">
					<a href="html/address_book.html" class="a2" target="_self">
						<div class="imgs two">
						</div>
						通讯录
					</a>
				</div>
				
				<div class="wechat">
					<a href="html/find.html" class="a3" target="_self">
						<div class="imgs three">
						</div>
						发现
					</a>
				</div>
				
				<div class="wechat">
					<a href="html/me.html" class="a4" target="_self">
						<div class="imgs four">
						</div>
						我
					</a>
				</div>
			</div>
		</div>
	</body>
</html>
